<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page isELIgnored="false" %>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<html>
<head>
    <title>商品信息</title>
    <link rel="shortcut icon" type="imagges/x-ion" href="人.jpg"/>
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="resources/css/table.css" />

    <style type="text/css">
        #fade {    /*遮罩层*/
            display:none;  /* 元素不可见*/
            position:absolute;  /*绝对定位*/
            top:0%;
            left:0%;
            width:100%;
            height:100%;
            background-color:black;
            z-index:1;  /*元素的堆叠顺序*/
            -moz-opacity:0.3;
            opacity:.3;   /*透明度*/
            filter:alpha(opacity=3);
        }
        #light{
            display:none;
            position:absolute;
            width:400px;
            top:50%;
            left:50%;
            margin:-220px 0 0 -200px;
            padding:0px;
            background-color:white;
            z-index:2;
            overflow:auto;
            border-radius: 5px;
        }
        #dv1{
            background-color: #3a3a3a;
            height: 60px;
            color: white;
            font-size: 18px;
            line-height: 60px;
        }
        #dv2{
            border-bottom: 1px solid gainsboro;
        }
        #dv3{
            text-align: center;
            padding-top: 7px;
        }
        .addForm{
            padding-top: 30px;
            text-align: center;
            font-size: 100%;
        }
        input,select{height: 40px; width: 270px;font-size: 90%}
        label{display: block;padding: 10px }
        .btn{ height: 35px; width: 70px;border: 0px; font-size: 100%;}
        #OKbt{background-color: #64b8f9; color: white}

    </style>
</head>
<body>
<div id="dv">
    <h3>商品信息管理</h3>
        <div>
            <div style="display: inline-block;">
                <form id="search-form" action="merchServlet?method=merchSelect" method="post">
                    <input type="text"  name="rname" value="Search" placeholder="请输要查询的商品名称" id="insearch" onfocus="if (value=='Search'){value=''}" onblur="if (value == ''){value='Search'} "/>
                    <input type="hidden" value="InfoSearch" name="method"/>
                    <img src="resources/img/seach.png"  onclick="toSeach()" style="height: 30px;width: 30px;vertical-align: middle;">

                </form>
            </div>


            <div style="display: inline-block;float: right;margin-right: 50px;" id="openbt">
                <div id="dvadd">
                    <img src="resources/img/add.png" id="dvaddpc" />
                </div>
            </div>
        </div>

    <div class="fixedTable">
    <table  cellspacing="0"  class="myTable" id="nav_tab" align="center">
    <thead >
    <tr id="tr3"  bgcolor="#1976d5" >
            <th >商品编号</th>
            <th>商品类别编号</th>
            <th>商品名</th>
            <th>生产日期</th>
            <th>商品价格</th>
            <th colspan="2">操作</th>
        </thead>
        <tbody class="grid" align="center"  >

        <c:forEach items="${meList.list}" var="item">
            <tr height="40px">
                <td name="merchId">${item.merchId }</td>
                <td name="mertypeId">${item.mertypeId }</td>
                <td name="merchname">${item.merchname }</td>
                <td name="merchdate">${item.merchdate }</td>
                <td name="merchprice">${item.merchprice }</td>
                <td colspan="2"id="td8">
                    <a id="achange" title="编辑" style="float: left;margin-left: 75px;">
                        <div id="dvchange" align="center">
                        <img src="resources/img/change.png" id="imgchange" class="formIcon"onclick="updateMe(${item.merchId })">
                        </div>
                    </a>
                    <a id="adel" title="删除" style="float: left;margin-left: 35px;">
                        <div id="dvdel" align="center">
                        <img src="resources/img/del.png "id="imgdel" class="formIcon" onclick="deleteMe(${item.merchId })"/>
                        </div>
                    </a>

                </td>
            </tr>
        </c:forEach>

        </tbody>
    </table>
    <div/>
    <div id="light">
        <div id="dv1" name="head"><span style="margin-left: 30px">编辑新增商品信息</span></div>

        <form action="merchServlet?method=merchAdd" method="post" class="addForm">
            <div id="dv2" name="body" style="padding-bottom: 30px;">
                <label>
                    商品类型:&nbsp;<input type="number" name="merchTypeld" placeholder="请输入商品类型">
                </label>
                <label>
                    商品名字:&nbsp; <input type="text" name="merchName" placeholder="请输入商品名字">
                </label>
                <label>
                    生产日期:&nbsp; <input type="date" name="merchDate" placeholder="请输入生产日期">
                </label>
                <label>
                    商品价格:&nbsp;  <input type="text" name="merchPrice" placeholder="请输入商品价格">
                </label>

            </div>
            <div colspan="2"id="dv3" name="foot" >
                <button type="sumbit" id="OKbt" class="btn" >确&nbsp;&nbsp;认</button>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <button type="reset" id="closebt" class="btn" >取&nbsp;&nbsp;消</button>
            </div>
        </form>
    </div>
    <div id="fade"></div>
    </div>
</div>
</body>


</html>  <script type="text/javascript">

    function deleteMe(meId){
        if(confirm('确认要删除？'))
        {
            var meId=meId;
            window.location.href="merchServlet?method=marchDel&meId="+meId;
        }

    }
    function updateMe(meId){
        var meId=meId;
        window.location.href="merchServlet?method=merchSignal&meId="+meId;
    }
    function toSeach(merId) {
        var seachVul=document.getElementById("insearch").value;
        window.location.href="merchServlet?method=merchOne&meId="+seachVul;
    }
    window.onload=function(){
        var linkbt=document.getElementById("openbt");
        var light=document.getElementById('light');
        var fade=document.getElementById('fade');
        var dv1=document.getElementById('dv1');
        var closebt=document.getElementById("closebt");
        var OKbt=document.getElementById('OKbt');
        linkbt.onclick=function(){
            light.style.display='block';
            fade.style.display='block';
        }
        closebt.onclick=function(){
            light.style.display='none';
            fade.style.display='none';
        }
        OKbt.onclick=function () {
            light.style.display='none';
            fade.style.display='none';
        }

    }
</script>
